<template>
  <div>
    <div class="search_form">
			<div>
				<el-date-picker
					size="mini"
					v-model="searchForm.workDate"
					type="date"
					format="yyyy年MM月dd日"
					value-format="yyyy-MM-dd"
					placeholder="选择日期"
					class="others"
          clearable
				></el-date-picker>
        <el-select
					size="mini"
					clearable
					placeholder="请选择班次"
					v-model="searchForm.workTime"
					class="others"
					popper-class="selectClass"
				>
					<el-option v-for="(item, index) in shiftList" :key="index" :label="item.dictLabel" :value="item.dictValue"></el-option>
				</el-select>
				<el-button @click="searchData" class="search_btn" type="primary" icon="el-icon-search" size="mini">
					查询
				</el-button>
			</div>
		</div>
    <BaseTable
      :loading="loading"
      ref="trustOrderData"
      :data="tableData"
      :columns="columns" 
      @details="detailHandlerClick"
      :tableHeight="tableHeight" 
      :pagination="false"></BaseTable>

    <div class="header">
			<el-date-picker
				style="width: 160px"
				v-model="formLabelAlign.time"
				type="date"
				format="yyyy年MM月dd日"
				value-format="yyyy-MM-dd"
				placeholder="选择日期"
				class="others"
				size="mini"
			></el-date-picker>
			<div style="width: 10px"></div>
			<span style="font-size: 10px;width: 10px;color:red;">{{'*'}}</span>
			<el-select
				style="width: 90px"
				size="mini"
				filterable
				clearable
				placeholder="选择班次"
				class="others"
				v-model="formLabelAlign.workTime"
			>
				<el-option
					v-for="(item, index) in shiftList"
					:key="index"
					:label="item.dictLabel"
					:value="item.dictValue"
				></el-option>
			</el-select>
			<div style="width: 10px"></div>

			<el-button @click="sureimport" size="mini" type="primary">导入</el-button>
		</div>
  </div>
</template>
<script>
import BaseTable from '@/components/BaseTable'
import publicapi from '@/api/public/index'
import api from '@/api/Dispatch/operationPlan/index'
export default {
  components: { BaseTable },
  props: {
    workTimeList: {
      type: Array,
    },
    closeDrawer: {
      type: Function,
    }
  },
  data () {
    return{
      searchForm: {
        workDate: '',
        workTime: '',
      },
      formLabelAlign: {
        time: '',
        workTime: '',
      },
      shiftList: this.workTimeList,
      tableHeight: window.innerHeight - 200,
      loading: false,
      tableData: [],
      columns: [
        {
          prop: 'planNo',
          label: '编号',
        },
        {
          prop: 'processName',
          label: '作业过程',
        },
        {
          prop: 'shipNameVoyage',
          label: '船名航次',
        },
        {
          prop: 'cargoName',
          label: '货名',
        },
        {
          prop: 'processName',
          label: '货代',
        },
        {
          prop: 'processName',
          label: '货主',
        },
        {
          prop: 'loadUnload',
          label: '装卸',
        },
        {
          prop: 'berthNo',
          label: '泊位'
        },
        {
          prop: 'storehouseName',
          label: '库场'
        },
      ],
      detailInfo: null,
    }
  },
  created() {
    //  日期默认当天
		let date = new Date()
		let theYear = date.getFullYear() //获取完整的年份(4位)
		let theMonth = date.getMonth() + 1 //获取当前月份(1-12,1代表1月)
		theMonth = theMonth >= 10 ? theMonth : "0" + theMonth
		let theDay = date.getDate() //获取当前日(1-31)
		theDay = theDay >= 10 ? theDay : "0" + theDay
    this.searchForm.workDate = theYear+'-'+theMonth+'-'+theDay
    this.formLabelAlign.time = theYear+'-'+theMonth+'-'+theDay

  },
  mounted () {
    this.searchData()
    this.getScheduleNow()
  },
  methods: {
    // 获取当前班次
    getScheduleNow () {
      publicapi.getScheduleNow().then(res => {
        this.formLabelAlign.workTime = res.data.data.scheduleType
        this.searchForm.workTime = res.data.data.scheduleType
      })
    },
    // 查询
    searchData () {
      this.loading = true
      let params = Object.assign({},this.searchForm)
      api.queryByStatus(params).then(res => {
        if (res.data.code != '0000') {
          return this.$message.error(res.data.msg)
        }
        this.loading = false
        this.tableData = res.data.data
        this.tableData.forEach(v => {
          v.shipNameVoyage = (v.shipName != null ? v.shipName + '_' : '') + (v.voyage != null ? v.voyage : '')
        })
        this.detailInfo = null
      })
    },
    // 选中事件
    detailHandlerClick (val) {
      this.detailInfo = val
      console.log(val)
    },
    // 导入
    sureimport () {
      if (!this.formLabelAlign.workTime) {
        return this.$message.warning('请选择班次')
      }
      if (this.detailInfo == null) {
        return this.$message.warning('请选中一条数据再导入')
      }
      let params = {
        id: this.detailInfo.id,
        workDate: this.formLabelAlign.time,
        workTime: this.formLabelAlign.workTime
      }
      api.copylastwork(params).then(res => {
        if (res.data.code != '0000') {
          return this.$message.error(res.data.msg)
        }
        this.$message.success('导入成功')
        this.closeDrawer()
      })
    },
  }
}
</script>
<style lang="less" scoped>
@import "../../../../assets/searchfrom.less";
@import "../index.less";
</style>
